<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no,initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>头条新闻</title>
    <link rel="stylesheet" href="./assets/mui/css/mui.css">
    <link rel="stylesheet" href="./css/HotNews.css">
    <link rel="stylesheet" href="./css/base.css">
    <script src="./js/rem.js"></script>
    <script src="./assets/mui/js/mui.js"></script>
    <script src="./assets/template/template-native.js"></script>
    <script src="./assets/zepto/zepto.min.js"></script>
    <script src="./js/HotNews.js"></script>
</head>

<body>
    <div class="newsTop">
        <!-- topbar -->
        <div class="h_tap">
            <a class="h_back" href=""><img src="./images/Honey/返回.png" alt=""></a>
            <span>新闻头条</span>
            <a href="javascript:;">收藏</a>
        </div>
        <!-- 信息分类 -->
        <div class="newsClass">
            <div>
                <div id="segmentedControl"
                    class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-primary">
                    <a class="mui-control-item mui-active" href="#item1">
                        保险政策
                    </a>
                    <a class="mui-control-item" href="#item2">
                        保险课堂
                    </a>
                    <a class="mui-control-item " href="#item3">
                        保险知识
                    </a>
                    <a class="mui-control-item " href="#item4">
                        保险财富
                    </a>
                </div>
            </div>
            <div>
                <div id="item1" class="mui-control-content mui-active">
                    <ul class="mui-table-view" id="news_list">
                        <!-- <li class="mui-table-view-cell">
                            <div class="newsContent">
                                <p class="newsTitle">中海达的弄懂多大冬季农大京东网京东网点击物品点击为破蛋我的奇偶我觉得我配电间</p>
                                <img src="./images/图片.png" alt="">
                                <div class="newsC">
                                    <div class="newslaiyuan">
                                        <img src="./images/来源.png" alt="">
                                        太平洋保险
                                    </div>
                                    <div class="newsR">
                                        <span>380 浏览</span>&nbsp;&nbsp;
                                        <span>300 收藏</span>
                                    </div>
                                </div>
                            </div>
                        </li> -->
                        <!-- <li class="mui-table-view-cell">
                                <div class="newsContent">
                                    <p class="newsTitle">京东网京东我的奇偶我觉得我配电间</p>
                                    <img src="./images/图片.png" alt="">
                                    <div class="newsC">
                                        <div class="newslaiyuan">
                                            <img src="./images/来源.png" alt="">
                                            太平洋保险
                                        </div>
                                        <div class="newsR">
                                            <span>380 浏览</span>&nbsp;&nbsp;
                                            <span>300 收藏</span>
                                        </div>
                                    </div>
                                </div>
                            </li> -->
                    </ul>
                </div>
                <div id="item2" class="mui-control-content">
                    <ul class="mui-table-view">
                        <li class="mui-table-view-cell">
                            中国日本哈士奇
                        </li>

                    </ul>
                </div>
                <div id="item3" class="mui-control-content">
                    <ul class="mui-table-view">
                        <li class="mui-table-view-cell">
                            老男人的悲伤
                        </li>
                    </ul>
                </div>
                <div id="item4" class="mui-control-content">
                    <ul class="mui-table-view">
                        <li class="mui-table-view-cell">
                            啪啪啪啪啪啪
                        </li>
                    </ul>
                </div>
            </div>
        </div>

        <!-- 模板引擎渲染  -->
        <script type="text/template" id="news_first">
        <% for(var i=0;i<data.length;i++){%>
            <li class="mui-table-view-cell">
                    <div class="newsContent">
                        <p class="newsTitle"><%=data[i].title %></p>
                        <a href="javascript:;"><img src="./images/HotNews/图片.png" alt=""></a>
                        <div class="newsC">
                            <div class="newslaiyuan">
                                <img src="./images/HotNews/来源.png" alt="">
                                <%=data[i].origin %>
                            </div>
                            <div class="newsR">
                                <span><%=data[i].pv_nums %> 浏览</span>&nbsp;&nbsp;
                                <span><%=data[i].collect_nums %>收藏</span>
                            </div>
                        </div>
                    </div>
                </li>
        <% } %>
    </script>
</body>

</html>